require('./index.css');
let sideBar = require('../aside/index.js');
let _util = require('util/util.js');
let _pageService = require('service/trashCertificatePhotosService.js');
let ImageModal = require('util/imageModal/index.js');
let _index = require('service/indexService.js');

let page = {
    data: {
        imageModal: null,
        imageStart: 0
    },
    init: function () {
        this.onLoad();
        this.bindEvent();
    },
    onLoad: function () {

        _pageService
            .loadTableInfo({
                //表头字段
                fields: {
                    "fileNo": "原所属档号",
                    "positionNo": "原所属位置",
                    "names": "逝者姓名",
                    "IDDescription": "证件描述",
                    "opera": "操作"
                },
                //格式化数据
                formatterData: function (data, fields) {
                    let formatterArray = [];

                    $.each(data, function (index, value) {
                        let newObj = Object.assign({}, data[index]);
                        newObj.IDDescription = `<a href="#" data-fileId="${value.id}" class="jsOpenImageModal">点击查看</a>`;
                        newObj.opera =
                            `
                            <a href="#" class="jsRecover opera" data-fileId="${value.id}" style="margin-right:10px;" title="撤销删除">
                                <i class="fa fa-undo"></i>
                            </a>
                            <a href="#" class="jsAddToTrash opera" data-fileId="${value.id}" style="color:red" title="彻底删除">
                                <i class="fa fa-trash"></i>
                            </a>
                        `
                        formatterArray.push(newObj);
                    })

                    return formatterArray;
                }
            })
            .then((res) => {
                _util.renderTable({
                    fields: res.fields || {},
                    formatterData: res.formatterData,
                    selector: $('#info_table'),
                    data: res.data
                });
            })


        sideBar.init({
            name: 'trash-certificate-photos'
        })
    },
    bindEvent: function () {
        let _this = this;

        //点击查看证件照
        $(document).on('click', '.jsOpenImageModal', function (e) {
            let fileid = $(e.currentTarget).data('fileid');

            _pageService
                .loadCertificatePhotosTable({
                    boxNo: fileid[0],
                    fileNo: fileid[1],
                    positionNo: [2]
                })
                .then(res => {
                    _util.renderTable({
                        fields: {
                            "title": "题名",
                            "date": "日期",
                            "pageNum": "页号",
                            "remarks": "备注"
                        },
                        showRefresh: false,
                        pagination: false,
                        selector: $('#credential-table'),
                        formatterData: _this.formatterData,
                        data: res
                    });

                    $('.image-modal-wrapper').show();
                })
        });

        //关闭弹窗
        $(document).on('click', '.close-btn-table , .jsCloseBtn', function () {
            _util.destoryTable($('#credential-table'));
            $('.image-modal-wrapper').hide();
        });

        //关闭弹窗
        $(document).on('click', '.close-btn', function (e) {
            $(".credentials-wrapper").hide();
        });

        //根据点开的table提名查看图片
        $(document).on('click', '.openModalToCheckImg', function (e) {
            let fileid = $(this).data('fileid').split('-');

            _this.data.imageStart = $(this).data('image-start');

            _this.data.imageModal ? '' : (_this.data.imageModal = new ImageModal());

            _index
                .loadImages({
                    data: {
                        boxNo: fileid[0],
                        fileNo: fileid[1],
                        positionNo: fileid[2]
                    }
                })
                .then(res => {
                    _this.data.imageModal.render({
                        container: $('.credentials-wrapper'),
                        data: _this.getClickEntryImage(res[0])
                    });
                    $('.credentials-wrapper').show();
                })
        });
    },
    //提取点击提名获取到的数据
    getClickEntryImage: function (data) {
        let imageStartIndex = this.data.imageStart,
            imgs = data.documents;

        for (let i = 0, length = imgs.length; i < length; i++) {
            const obj = imgs[i];
            if (obj['pageNum'] === imageStartIndex) {
                return obj;
            }
        }

        return {};
    },
    formatterData: function (data, fields) {
        let formatterArray = [],
            imagesInfo = data[0].images,
            newData = {
                boxNo: data[0]["boxNo"],
                fileNo: data[0]['fileNo'],
                positionNo: data[0]['positionNo']
            }

        $.each(imagesInfo, function (index, value) {
            let newObj = Object.assign({}, imagesInfo[index]);
            newObj.title =
                `
                <a href="#" class="openModalToCheckImg" data-image-start="${value.pageNum}" data-fileid="${newData.boxNo}-${newData.fileNo}-${newData.positionNo}" title="${newObj.title}">${newObj.title}</a>
            `
            formatterArray.push(newObj);
        })

        return formatterArray;
    }
};

$(function () {
    page.init();
})